<template>
  <div class="app-container">
    <div class="head-container">
      <div v-if="!crud.props.searchToggle">
        <el-form
          size="small"
          label-width="100px"
          :rules="rules"
          ref="form"
          :model="crud.order"
          :disabled="
            crud.order.orderStatus === 'PASS' ||
            crud.order.orderStatus === 'CLOSE'
          "
        >
          <el-row :gutter="10">
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="业务日期" prop="busDate">
                <el-date-picker
                  v-model="crud.order.busDate"
                  type="date"
                  style="width: 100%"
                  default-value
                  placeholder="系统自动生成"
                  format="yyyy - MM - dd "
                  value-format="yyyy-MM-dd"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据编号" prop="code">
                <el-input
                  v-model="crud.order.code"
                  disabled
                  placeholder="系统自动生成"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="状态" prop="orderStatus">
                <el-select
                  :disabled="true"
                  v-model="crud.order.orderStatus"
                  class="filter-item"
                  clearable
                  placeholder="请选择状态"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in dict.common_order_status"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="往来单位" prop="customerId">
                <zSelect
                  :value.sync="crud.order.customerId"
                  :showName="crud.order.customerName"
                  url="api/dropDown/basCustomerList"
                  :params="{ businessAttr: '3' }"
                  style="width: 100%"
                  @change="updateCustom"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="核销金额">
                <el-input-number
                  size="medium"
                  :disabled="true"
                  style="width: 100%"
                  v-model="crud.order.cancelAmount"
                  :precision="2"
                  :step="0.1"
                />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="本次核销金额">
                <el-input-number
                  size="medium"
                  :disabled="true"
                  style="width: 100%"
                  v-model="crud.order.curCancelAmount"
                  :precision="2"
                  :step="0.1"
                />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="收付款金额">
                <el-input-number
                  size="medium"
                  :disabled="true"
                  style="width: 100%"
                  v-model="crud.order.taxAmount"
                  :precision="2"
                  :step="0.1"
                />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="尾差">
                <el-input-number
                  size="medium"
                  :disabled="true"
                  style="width: 100%"
                  v-model="crud.order.tailAmount"
                  :precision="2"
                  :step="0.1"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
              <el-form-item label="备注">
                <el-input v-model="crud.order.remark" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
              <el-form-item label="可分配金额">
                <el-input :value="distributableAmount" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="10">
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="出纳" prop="customerId">
                <zSelect
                  :value.sync="crud.order.payeeUserId"
                  :showName="crud.order.payeeUserName"
                  url="api/dropDown/sysUserList"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="收款人" prop="customerId">
                <zSelect
                  :value.sync="crud.order.cashierUserId"
                  :showName="crud.order.cashierUserName"
                  url="api/dropDown/sysUserList"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <!--   操作栏   -->
      <div>
        <el-button
          slot="left"
          @click="addDetail"
          type="primary"
          class="filter-item"
          size="mini"
        >
          添加
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          :disabled="
            crud.order.orderStatus === 'PASS' ||
            crud.order.orderStatus === 'CLOSE'
          "
          size="mini"
          type="primary"
          @click="submit()"
        >
          保存
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          size="mini"
          type="success"
          :disabled="crud.order.orderStatus !== 'SAVE'"
          :loading="crud.passLoading"
          @click="crud.doDetailPassOrReject('PASS', id)"
        >
          审核
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          size="mini"
          type="info"
          :loading="crud.rejectLoading"
          :disabled="crud.order.orderStatus !== 'PASS'"
          @click="crud.doDetailPassOrReject('REJECT', id)"
        >
          反审
        </el-button>
        <el-button
          :loading="crud.downloadLoading"
          class="filter-item"
          size="mini"
          type="warning"
          @click="crud.preView"
          >打印
        </el-button>
        <el-button
          :loading="crud.downloadLoading"
          class="filter-item"
          size="mini"
          type="warning"
          @click="crud.preView1"
          >打印预览
        </el-button>
        <el-button
          class="filter-item"
          size="mini"
          type="warning"
          @click="crud.refresh()"
          >刷新
        </el-button>
      </div>
      <el-card>
        <div slot="header">
          <span>收付款单</span>
          <div style="float: right">
            <el-button
              :disabled="
                crud.order.orderStatus === 'PASS' ||
                crud.order.orderStatus === 'CLOSE'
              "
              type="primary"
              @click="addReceiptOrder"
            >
              添加收款单
            </el-button>
            <el-button
              :disabled="
                crud.order.orderStatus === 'PASS' ||
                crud.order.orderStatus === 'CLOSE'
              "
              type="primary"
              @click="addPaymentOrder"
            >
              添加付款单
            </el-button>
          </div>
        </div>
        <el-form size="small" label-width="100px" ref="receiptPaymentQuery">
          <el-row :gutter="10">
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据类型" prop="sourceType">
                <el-select
                  v-model="receiptPaymentQuery.sourceType"
                  class="filter-item"
                  clearable
                  placeholder="请选择单据类型"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in dict.t_receipt_pay_type"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据编号" prop="code">
                <el-input
                  v-model="receiptPaymentQuery.sourceCode"
                  placeholder="模糊查询"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <span>
                <el-button
                  class="filter-item"
                  size="mini"
                  type="primary"
                  @click="searchReceiptAndPayment"
                  >搜索</el-button
                >
                <el-button
                  class="filter-item"
                  plain
                  size="mini"
                  type="primary"
                  @click="resetReceiptAndPayForm"
                  >重置</el-button
                >
              </span>
            </el-col>
          </el-row>
        </el-form>
        <el-table
          :data="crud.order.receiptPaymentList"
          stripe
          border
          :row-class-name="crud.tableRowClassName"
          size="small"
          show-summary
          v-loading="crud.loading"
          :summary-method="sumUnCancelAmount"
          @selection-change="getReceiptPayment"
          style="width: 100%"
        >
          <el-table-column
            :render-header="crud.renderHeader"
            type="selection"
            width="60"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="busDate"
            label="业务日期"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="sourceType"
            label="单据类型"
          >
            <template slot-scope="{ row }">
              <span
                v-for="item in dict.t_receipt_pay_type"
                v-if="item.value == row.sourceType"
              >
                {{ item.label }}
              </span>
            </template>
          </el-table-column>
          <el-table-column
            :render-header="crud.renderHeader"
            prop="sourceCode"
            label="单据编号"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="bankName"
            label="收款银行"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="taxAmount"
            label="金额"
          />
          <el-table-column
            width="110px"
            :render-header="crud.renderHeader"
            prop="cancelAmount"
            label="已核销金额"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="unCancelAmount"
            label="未核销金额"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            prop="curCancelAmount"
            label="本次核销金额"
          >
            <template slot-scope="{ row }">
              <el-input-number
                style="width: 100%"
                v-model="row.curCancelAmount"
                :precision="2"
                :step="0.1"
                @change="changeCurCancelAmount(row, $event)"
              />
            </template>
          </el-table-column>
          <el-table-column
            :render-header="crud.renderHeader"
            prop="remark"
            label="备注"
          >
            <template slot-scope="scope">
              <div
                class="remarkBox"
                @mousemove="setRemarkBox"
                @mouseout="mouse = true"
              >
                <div>{{ scope.row.remark }}</div>
                <div
                  class="hiRemark"
                  @mousemove="hiremark = false"
                  @mouseout="hiremark = true"
                  :style="{ top: remarkY + 'px', left: remarkX + 'px' }"
                >
                  <div class="remarkTitle flex a-item">备注</div>
                  {{ scope.row.remark }}
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            :render-header="crud.renderHeader"
            label="操作"
            fixed="right"
            align="center"
          >
            <template slot-scope="scope">
              <el-button
                slot="reference"
                class="el-icon-delete opration_icon_btn"
                :disabled="crud.order.orderStatus === 'PASS'"
                style="border: none; width: auto; height: auto"
                @click="delReceiptPaymentRow(scope.$index)"
              ></el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
      <el-card style="margin-top: 8px">
        <div slot="header">
          <span>进销存单据</span>
          <el-button
            :disabled="
              crud.order.orderStatus === 'PASS' ||
              crud.order.orderStatus === 'CLOSE'
            "
            style="float: right"
            type="primary"
            @click="getFinanceCustomerReceiptOrder"
          >
            申请抽单
          </el-button>
        </div>
        <el-form size="small" label-width="100px">
          <el-row :gutter="10">
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据类型">
                <el-select
                  v-model="receiptOrderQuery.sourceType"
                  class="filter-item"
                  clearable
                  placeholder="请选择单据类型"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in dict.replenish_sell_source"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据编号">
                <el-input
                  v-model="receiptOrderQuery.sourceCode"
                  placeholder="模糊查询"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="6">
              <span>
                <el-button
                  class="filter-item"
                  size="mini"
                  type="primary"
                  @click="searchReceiptOrder"
                  >搜索</el-button
                >
                <el-button
                  class="filter-item"
                  plain
                  size="mini"
                  type="primary"
                  @click="resetOrderQuery"
                  >重置</el-button
                >
              </span>
            </el-col>
          </el-row>
        </el-form>
        <el-table
          :data="crud.order.orderList"
          stripe
          border
          show-summary
          :summary-method="sumOrder"
          :row-class-name="crud.tableRowClassName"
          size="small"
          v-loading="crud.loading"
          style="width: 100%"
          @selection-change="crud.selectionChangeHandler"
        >
          <el-table-column
            :render-header="crud.renderHeader"
            type="selection"
            width="60"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            v-if="columns.visible('busDate')"
            prop="busDate"
            label="业务日期"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            v-if="columns.visible('sourceType')"
            prop="sourceType"
            label="单据类型"
          >
            <template slot-scope="{ row }">
              <span
                v-for="item in dict.replenish_sell_source"
                v-if="item.value == row.sourceType"
              >
                {{ item.label }}
              </span>
            </template>
          </el-table-column>
          <el-table-column
            width="180"
            :render-header="crud.renderHeader"
            v-if="columns.visible('sourceCode')"
            prop="sourceCode"
            label="单据编号"
          >
           <template slot-scope="{row}">
             <span  class="sourceCode" @click="jumpOrder(row)">
               {{ row.sourceCode }}
             </span>
           </template>
          </el-table-column>
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('customerName')"
            prop="customerName"
            label="往来单位"
          />
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('taxAmount')"
            prop="taxAmount"
            label="单据金额"
          />
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('cancelAmount')"
            prop="cancelAmount"
            label="已核销金额"
          />
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('unCancelAmount')"
            prop="unCancelAmount"
            label="未核销金额"
          />
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('curCancelAmount')"
            prop="curCancelAmount"
            label="本次核销金额"
          >
            <template slot-scope="{ row }">
              <span>
                <el-input-number
                  :disabled="
                    crud.order.orderStatus === 'PASS' ||
                    crud.order.orderStatus === 'CLOSE'
                  "
                  style="width: 100%"
                  v-model="row.curCancelAmount"
                  :precision="2"
                  :step="0.1"
                  @change="changeOrderCurCancelAmount(row, $event)"
                />
              </span>
            </template>
          </el-table-column>
          <el-table-column
            width="160"
            :render-header="crud.renderHeader"
            v-if="columns.visible('tailAmount')"
            prop="tailAmount"
            label="尾差"
          >
            <template slot-scope="{ row }">
              <span>
                <el-input-number
                  :disabled="
                    crud.order.orderStatus === 'PASS' ||
                    crud.order.orderStatus === 'CLOSE'
                  "
                  style="width: 100%"
                  v-model="row.tailAmount"
                  :precision="2"
                  :step="0.1"
                  @change="changeOrderTailAmount(row, $event)"
                />
              </span>
            </template>
          </el-table-column>
          <el-table-column
            width="180"
            :render-header="crud.renderHeader"
            v-if="columns.visible('deductionAmount')"
            prop="deductionAmount"
            label="抵扣金额"
          >
            <template slot-scope="{ row }">
              <span>
                <el-input-number
                  :disabled="
                    crud.order.orderStatus === 'PASS' ||
                    crud.order.orderStatus === 'CLOSE'
                  "
                  style="width: 100%"
                  v-model="row.deductionAmount"
                  :precision="2"
                  :step="0.1"
                />
              </span>
            </template>
          </el-table-column>
          <el-table-column
            :render-header="crud.renderHeader"
            v-if="columns.visible('remark')"
            prop="remark"
            label="备注"
          />
          <el-table-column
            :render-header="crud.renderHeader"
            label="操作"
            fixed="right"
            align="center"
          >
            <template slot-scope="scope">
              <el-button
                slot="reference"
                class="el-icon-delete opration_icon_btn"
                :disabled="
                  crud.order.orderStatus === 'PASS' ||
                  crud.order.orderStatus === 'CLOSE'
                "
                style="border: none; width: auto; height: auto"
                @click="delOrderRow(scope.$index)"
              ></el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
    </div>
    <j-dialog
      title="申请抽单"
      :top="orderTop"
      :visible.sync="showReceiptOrder"
      style="width: 80vw"
      is-mask
    >
      <div>
        <el-form size="small" label-width="100px" :model="receiptOrderQuery">
          <el-row :gutter="10">
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="业务日期">
                <div class="flex flex-row">
                  <el-date-picker
                    v-model="receiptOrderQuery.startDate"
                    align="right"
                    unlink-panels
                    class="fl1"
                    format="yyyy - MM - dd "
                    value-format="yyyy-MM-dd"
                    default-value
                    range-separator=""
                    placeholder="开始日期"
                  />
                  <el-date-picker
                    v-model="receiptOrderQuery.endDate"
                    align="right"
                    unlink-panels
                    class="fl1"
                    format="yyyy - MM - dd "
                    value-format="yyyy-MM-dd"
                    default-value
                    range-separator=""
                    placeholder="结束日期"
                  />
                </div>
              </el-form-item>
            </el-col>

            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="发货日期">
                <div class="flex flex-row">
                  <el-date-picker
                    v-model="receiptOrderQuery.sendStartDate"
                    align="right"
                    unlink-panels
                    class="fl1"
                    format="yyyy - MM - dd "
                    value-format="yyyy-MM-dd"
                    default-value
                    range-separator=""
                    placeholder="开始日期"
                  />
                  <el-date-picker
                    v-model="receiptOrderQuery.sendEndDate"
                    align="right"
                    unlink-panels
                    class="fl1"
                    format="yyyy - MM - dd "
                    value-format="yyyy-MM-dd"
                    default-value
                    range-separator=""
                    placeholder="结束日期"
                  />
                </div>
              </el-form-item>
            </el-col>

            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据编号">
                <el-input
                  v-model="receiptOrderQuery.code"
                  placeholder="支持模糊查询"
                ></el-input>
              </el-form-item>
            </el-col>

            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="单据类型">
                <el-select
                  v-model="receiptOrderQuery.type"
                  class="filter-item"
                  clearable
                  placeholder="状态"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in dict.replenish_sell_source"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="备注">
                <el-input
                  v-model="receiptOrderQuery.remark"
                  placeholder="单行输入"
                ></el-input>
              </el-form-item>
            </el-col>
            <!--            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">-->
            <!--              <el-form-item label="客户">-->
            <!--                <table-select-->
            <!--                  :tableColumns="-->
            <!--                  [-->
            <!--                  {prop:'code',label:'客户编码',width: '100'},-->
            <!--                  {prop:'name',label:'客户名称',width: '150'},-->
            <!--                  {prop:'address',label:'地址'},-->
            <!--                  {prop:'sCustomerName',label:'二批'},-->
            <!--                  ]"-->
            <!--                  labelKey="name"-->
            <!--                  valueKey="id"-->
            <!--                  width="700"-->
            <!--                  :value.sync="query.customerIds"-->
            <!--                  placeholder="请选择客户"-->
            <!--                  :params="{sCustomerIds: this.crud.order.customerId}"-->
            <!--                  url="/api/dropDown/sCustomerBindCustomerList"-->
            <!--                ></table-select>-->
            <!--              </el-form-item>-->
            <!--            </el-col>-->
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-form-item label="客户">
                <el-input
                  v-model="receiptOrderQuery.customerKeyword"
                  placeholder="单行输入"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
              <el-button type="primary" @click="receiptOrderSizeChangeHandler()"
                >搜索</el-button
              >
            </el-col>
          </el-row>
        </el-form>
      </div>
      <el-table
        ref="table1"
        stripe
        border
        height="480"
        :row-class-name="crud.tableRowClassName"
        v-loading="receiptOrderLoading"
        :data="receiptOrderTableData"
        size="small"
        show-summary
        :summary-method="sumRow"
        style="width: 100%"
        @selection-change="receiptOrderSelection"
      >
        <el-table-column
          :render-header="crud.renderHeader"
          type="selection"
          width="60"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('busDate')"
          prop="busDate"
          sortable
          label="业务日期"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('sendDate')"
          prop="sendDate"
          sortable
          label="发货日期"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('sourceType')"
          prop="sourceType"
          label="单据类型"
        >
          <template slot-scope="{ row }">
            <span
              v-for="item in dict.replenish_sell_source"
              v-if="item.value == row.sourceType"
            >
              {{ item.label }}
            </span>
          </template>
        </el-table-column>
        <el-table-column
          :render-header="crud.renderHeader"

          sortable
          label="单据编号"
        >
          <template scope="{ row }">
            <span style="color: blue;cursor: pointer" @click="jumpDetail(row)">
              {{ row.sourceCode }}
            </span>
          </template>
        </el-table-column>
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('customerName')"
          prop="customerName"
          label="客户名称"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('loadCode')"
          prop="loadCode"
          sortable
          label="配送单号"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          v-if="columns.visible('taxAmount')"
          prop="taxAmount"
          sortable
          label="金额"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          sortable
          v-if="columns.visible('cancelAmount')"
          prop="cancelAmount"
          label="已核销金额"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          sortable
          v-if="columns.visible('unCancelAmount')"
          prop="unCancelAmount"
          label="未核销金额"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          sortable
          v-if="columns.visible('curCancelAmount')"
          prop="curCancelAmount"
          label="本次核销金额"
        />
        <el-table-column
          :render-header="crud.driverUserName"
          sortable
          v-if="columns.visible('driverUserName')"
          prop="driverUserName"
          label="驾驶员"
        />
        <el-table-column
          :render-header="crud.renderHeader"
          sortable
          v-if="columns.visible('remark')"
          prop="remark"
          label="备注"
        />
      </el-table>
      <div style="height: 10px"/>
      <div  class="dialog-footer flex " style="justify-content: right;width: 100%;">
        <el-button type="text" @click="showReceiptOrder = false"
          >取消</el-button
        >
        <el-button
          :loading="crud.cu === 2"
          type="primary"
          @click="receiptOrderConfirm"
          >确认</el-button
        >
      </div>
    </j-dialog>
    <el-dialog title="收款单" :visible.sync="showVucherOrder" width="30%">
      <el-form
        size="small"
        label-width="80px"
        ref="vucherOrderForm"
        :rules="vucherRules"
        :model="vucherOrder"
        :disabled="crud.order.orderStatus === 'PASS'"
      >
        <el-row :gutter="10">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="业务日期" prop="busDate">
              <el-date-picker
                v-model="vucherOrder.busDate"
                type="date"
                style="width: 100%"
                default-value
                format="yyyy - MM - dd"
                value-format="yyyy-MM-dd"
                placeholder="系统自动生成"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="收款金额" prop="taxAmount">
              <el-input-number
                style="width: 100%"
                v-model="vucherOrder.taxAmount"
                :precision="2"
                :step="0.1"
              />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="收款银行" prop="bankId">
              <zSelect
                :value.sync="vucherOrder.bankId"
                url="api/dropDown/basBankList"
                :params="{ sort: 'seq desc' }"
                style="width: 100%"
                @change="changeVucherBank"
              />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="收款类型" prop="type">
              <el-select
                v-model="vucherOrder.type"
                clearable
                placeholder="请选择"
                size="small"
                style="width: 100%"
              >
                <el-option
                  v-for="item in dict.t_finance_customer_receipt_type"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="备注">
              <el-input v-model="vucherOrder.remark" placeholder="请输入备注" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="text" @click="showVucherOrder = false">取消</el-button>
        <el-button
          :loading="crud.cu === 2"
          type="primary"
          @click="vucherOrderConfirm"
          >确认</el-button
        >
      </div>
    </el-dialog>
    <el-dialog title="付款单" :visible.sync="showPaymentOrder" width="30%">
      <el-form
        size="small"
        label-width="80px"
        ref="paymentOrderForm"
        :rules="paymentOrderRules"
        :model="paymentOrder"
        :disabled="crud.order.orderStatus === 'PASS'"
      >
        <el-row :gutter="10">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="业务日期" prop="busDate">
              <el-date-picker
                v-model="paymentOrder.busDate"
                type="date"
                style="width: 100%"
                default-value
                format="yyyy - MM - dd"
                value-format="yyyy-MM-dd"
                placeholder="系统自动生成"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="付款金额" prop="taxAmount">
              <el-input-number
                style="width: 100%"
                v-model="paymentOrder.taxAmount"
                :precision="2"
                :step="0.1"
              />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="付款银行" prop="bankId">
              <zSelect
                :value.sync="paymentOrder.bankId"
                url="api/dropDown/basBankList"
                :params="{ sort: 'seq desc' }"
                style="width: 100%"
                @change="changePaymentBank"
              />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="付款类型" prop="type">
              <el-select
                v-model="paymentOrder.type"
                clearable
                placeholder="请选择"
                size="small"
                style="width: 100%"
              >
                <el-option
                  v-for="item in dict.t_finance_supplier_payment_type"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="备注">
              <el-input
                v-model="paymentOrder.remark"
                placeholder="请输入备注"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="text" @click="showPaymentOrder = false"
          >取消</el-button
        >
        <el-button
          :loading="crud.cu === 2"
          type="primary"
          @click="paymentOrderConfirm"
          >确认</el-button
        >
      </div>
    </el-dialog>
    <el-dialog
      title="请选择打印模板"
      :visible.sync="crud.printConfig.pringDialog"
      width="30%"
    >
      <jPrintConfig
        groupId="financeSettlement"
        v-if="crud.printConfig.pringDialog"
        @getPrintId="crud.detailedPrint"
        :isPreview="crud.printConfig.isPreview"
      ></jPrintConfig>
    </el-dialog>
  </div>
</template>

<script>
import financeSettlement from '@/api/erp/financeSettlement';
import CRUD, { crud, form, header, presenter } from '@crud/crud';
import rrOperation from '@crud/RR.operation';
import crudOperation from '@crud/CRUD.operation';
import udOperation from '@crud/UD.operation';
import pagination from '@crud/Pagination';
import jtgSelectPlus from '@/components/select/JtgSelectPlus';
import { Notification, Pagination } from 'element-ui';
import { getBusTime, isEmpty } from '@/utils';
import financeSupplierPayment from '@/api/erp/financeSupplierPayment';
import crudFinanceCustomerReceipt from '@/api/erp/financeCustomerReceipt';
import jPrintConfig from '../../../components/jPrintConfig/jPrintConfig';
import { salesDetailKey } from '@/utils/key';
import JDialog from "@/components/jDialog/jDialog.vue";
// crud交由presenter持有
const defaultCrud = CRUD({
  title: '结算单据明细',
  order: {
    busDate: getBusTime(),
    curCancelAmount: 0.0,
    orderList: [],
    receiptPaymentList: [],
  },
  params() {
    const href = location.href.split('/');
    return {
      id: href[href.length - 1] == 'add' ? 0 : href[href.length - 1],
    };
  },
  url: 'api/financeSettlement/detail',
  sort: 'id,desc',
  crudMethod: { ...financeSettlement },
});
const defaultForm = {
  id: null,
  code: null,
  name: null,
  type: null,
  busDate: null,
  sourceType: null,
  sourceId: null,
  sourceCode: null,
  customerId: null,
  customerCode: null,
  customerName: null,
  isContact: null,
  customerAreaId: null,
  customerAreaCode: null,
  customerAreaName: null,
  customerTypeId: null,
  customerTypeCode: null,
  customerTypeName: null,
  pCustomerId: null,
  pCustomerCode: null,
  pCustomerName: null,
  mCustomerId: null,
  mCustomerCode: null,
  mCustomerName: null,
  sCustomerId: null,
  sCustomerCode: null,
  sCustomerName: null,
  deptId: null,
  deptCode: null,
  deptName: null,
  userId: null,
  userCode: null,
  userName: null,
  taxAmount: null,
  tailAmount: null,
  cancelAmount: null,
  unCancelAmount: null,
  cancelStatus: null,
  cancelDate: null,
  cancelUserId: null,
  cancelUserCode: null,
  cancelUserName: null,
  isPrint: null,
  printCount: null,
  seq: null,
  orderStatus: null,
  remark: null,
  customerKeyword: null,
  orderRemark: null,
  createUserId: null,
  createUserCode: null,
  createUserName: null,
  createTime: null,
  updateUserId: null,
  updateUserCode: null,
  updateUserName: null,
  updateTime: null,
  auditUserId: null,
  auditUserCode: null,
  auditUserName: null,
  auditTime: null,
  closeUserCode: null,
  closeUserId: null,
  closeUserName: null,
  closeTime: null,
};

export default {
  name: 'financeSettlementDetail',
  components: {
    JDialog,
    pagination,
    crudOperation,
    rrOperation,
    udOperation,
    jtgSelectPlus,
    'el-pagination': Pagination,
    jPrintConfig,
  },
  mixins: [
    presenter(defaultCrud),
    header(),
    form(defaultForm),
    crud(),
    salesDetailKey,
  ],
  dicts: [
    'common_order_status',
    't_buy_order_source_type',
    'replenish_sell_source',
    't_receipt_pay_type',
    't_finance_supplier_payment_type',
    't_finance_customer_receipt_type',
  ],
  data() {
    return {
      copyForm: null,
      rules: {
        customerId: [
          { required: true, message: '往来单位不能为空', trigger: 'blur' },
        ],
      },
      mouse: true,
      remarkX: 0,
      remarkY: 0,
      hiremark: true,
      vucherRules: {
        busDate: [
          { required: true, message: '业务日期不能为空', trigger: 'blur' },
        ],
        taxAmount: [
          { required: true, message: '收款金额不能为空', trigger: 'blur' },
        ],
        bankId: [
          { required: true, message: '收款银行不能为空', trigger: 'blur' },
        ],
        type: [
          { required: true, message: '收款类型不能为空', trigger: 'blur' },
        ],
      },
      summary: {},
      paymentOrderRules: {
        busDate: [
          { required: true, message: '业务日期不能为空', trigger: 'blur' },
        ],
        taxAmount: [
          { required: true, message: '收款金额不能为空', trigger: 'blur' },
        ],
        bankId: [
          { required: true, message: '收款银行不能为空', trigger: 'blur' },
        ],
        type: [
          { required: true, message: '收款类型不能为空', trigger: 'blur' },
        ],
      },
      selectReceiptPayment: [],
      receiptPaymentQuery: {
        id: null,
        sourceCode: null,
        sourceType: null,
      },
      resetOrderList: [],
      resetReceiptPaymentList: [],
      orderTop: '0.2vh',
      pageable: {
        // 页码
        page: 1,
        // 每页数据条数
        size: 999,
        // 总数据条数
        total: 0,
      }, // 收款单单据翻页
      showReceiptOrder: false,
      receiptOrderQuery: {
        customerId: 0,
      }, // 收款单单据查询条件
      receiptOrderLoading: false,
      receiptOrderTableData: [],
      oldCancelAmount: 0.0,
      showVucherOrder: false,
      showPaymentOrder: false,
      vucherOrder: {
        // taxAmount:null,
        // bankId: null,
        // type: null,
        busDate: getBusTime(),
        remark: null,
      },
      paymentOrder: {
        busDate: getBusTime(),
        remark: null,
      },
      orderSourcePath:{
        "1":"/buy/buyOrderDetail/",
        "2":"/fee/feeOrderDetail/",
        "3":"/buy/buyBegin?id=",
        "4":"/sale/salesOrder/",
        "5":"/ware/wareReturnBottleBox/",
        "6":"/sale/salesBegin?id=",
        "7":"/sale/orderMeetingDetail/",
        "8":"/fee/feeOrderDetail/",
        "9":"/fee/feeOrderDetail/",
      }
    };
  },
  activated() {
    //获取上次进入Id
    const id = sessionStorage.getItem(this.$options.name + 'Id');
    //记录本次进入的Id
    sessionStorage.setItem(this.$options.name + 'Id', this.$route.params.id);
    if (!this.crud.header) this.getHeader();
    if (id !== this.$route.params.id) {
      if (this.$route.params.id === 'add') {
        this.$set(this.crud, 'order', Object.assign({}, this.copyForm));
        this.crud.data = [];
        this.crud.order.receiptPaymentList = [];
        this.crud.order.orderList = [];
        this.resetOrderList = [];
        this.resetReceiptPaymentList = [];
        // this.vucherOrder = []
        // this.paymentOrder = []
        // console.log(this.vucherOrder)
        // this.$set(this.crud.order,'receiptPaymentList',[])
        // this.$set(this.crud.order,'orderList',[])
        // this.$set(this.crud,'data',[])
      } else if (this.$route.params.id.indexOf('copy') !== -1) {
        const copyid = this.$route.params.id.split('=')[1];
        this.crud.toGetCopyInfo(copyid);
      } else {
        // console.log(this.vucherOrder)
        // this.vucherOrder = {}
        // this.paymentOrder = {}
        this.crud.params.id = this.$route.params.id;
        this.crud.refresh();
      }
    }
    this.idDate = this.$route.query.idDate;
    if (this.idDate) {
      this.idList = JSON.parse(sessionStorage.getItem(this.idDate)) || [];
    } else {
      this.idList = [];
    }
    this.isExceed = this.$route.query.isExceed;
  },
  created() {
    // if (this.$route.params.id == 'add') {
    /*if (this.crud.getItemInfo("financeSettlementDetail_add")) {
      console.log(this.crud.getItemInfo("financeSettlementDetail_add"))
      return false
    }*/
    this.crud.order = {
      busDate: getBusTime(),
      curCancelAmount: 0.0,
      orderList: [],
      receiptPaymentList: [],
    };
    this.copyForm = Object.assign({}, this.crud.order);
    // }
    if (this.$route.params.id != 'add') {
      this.id = this.$route.params.id;
    }
    if (this.crud.order.busDate)
      this.crud.order.busDate = new Date().toISOString().split('T')[0];
  },
  methods: {
    [CRUD.HOOK.afterRefresh](crud, form) {
      crud.order.curCancelAmount = 0.0;
      if (crud.order.orderList) {
        for (let i = 0; i < crud.order.orderList.length; i++) {
          crud.order.curCancelAmount += crud.order.orderList[i].curCancelAmount;
        }
        this.resetOrderList = crud.order.orderList;
      }
      this.receiptPaymentQuery.id = crud.order.customerId;
      this.receiptOrderQuery.customerId = crud.order.customerId;
      this.resetReceiptPaymentList = this.crud.order.receiptPaymentList;
    },
    // 选中收款单单据
    receiptOrderSelection(rows) {
      if (rows) {
        this.selectedRows = rows;
        this.crud.selectionChangeHandler(rows);
      }
    },
    receiptOrderSizeChangeHandler(e) {
      this.pageable.page = 1;
      this.getFinanceCustomerReceiptOrder();
    },
    receiptOrderPageChangeHandler(e) {
      this.pageable.page = e;
      this.getFinanceCustomerReceiptOrder();
    },
    // 收款单单据弹窗点击确定
    receiptOrderConfirm(e) {
      if (!this.selectedRows) {
        this.$message.error('请选择抽单数据');
        return;
      }
      this.selectedRows.forEach((row) => {
        const sourceCode = row.sourceCode;
        let flag = this.checkSourceCode(row);
        if (flag) {
          this.$message.error('单据编号已存在，请核查！');
          return false;
        }
        let item = {
          busDate: row.busDate,
          sourceId: row.sourceId,
          sourceType: row.sourceType,
          sourceCode: sourceCode,
          customerName: row.customerName,
          customerId: row.customerId,
          taxAmount: row.taxAmount,
          cancelAmount: row.cancelAmount,
          unCancelAmount: row.unCancelAmount,
          curCancelAmount: row.unCancelAmount,
          tailAmount: row.tailAmount,
          remark: row.remark,
        };
        this.crud.order.orderList.push(item);
        this.crud.order.curCancelAmount += row.unCancelAmount;
        this.crud.order.cancelAmount += row.cancelAmount;
        this.crud.order.unCancelAmount += row.unCancelAmount;
        this.crud.order.tailAmount += row.tailAmount;
      });
      this.resetOrderList = this.crud.order.orderList;
      this.showReceiptOrder = false;
    },
    setRemarkBox(e) {
      if (this.mouse && this.hiremark) {
        this.mouse = false;
        this.remarkX = e.clientX;
        this.remarkY = e.clientY;
      }
    },
    checkSourceCode(row) {
      let flag = false;
      if (this.crud.order.orderList) {
        for (let i = 0; i < this.crud.order.orderList.length; i++) {
          if (this.crud.order.orderList[i].sourceCode === row.sourceCode) {
            flag = true;
          }
        }
      }
      return flag;
    },
    //跳转到单据明细
    jumpDetail(row){

      const path = this.orderSourcePath[row.sourceType]
      if(path){
        this.$router.push({
          path:path+row.sourceId,
        })
      }
    },
    // 收款单单据列表
    getFinanceCustomerReceiptOrder() {
      this.receiptOrderQuery.customerId = this.crud.order.customerId;
      let params = {
        ...this.receiptOrderQuery,
        ...this.pageable,
      };
      this.receiptOrderLoading = true;
      financeSettlement
        .orderDetail(params)
        .then((res) => {
          this.receiptOrderTableData = res.data.content;
          this.showReceiptOrder = true;
          this.summary = res.data.summary;
          this.receiptOrderLoading = false;
        })
        .finally(() => {
          this.receiptOrderLoading = false;
        });
    },
    sumOrder({ columns, data }) {
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (
          column.property === 'taxAmount' ||
          column.property === 'cancelAmount' ||
          column.property === 'unCancelAmount' ||
          column.property === 'curCancelAmount' ||
          column.property === 'tailAmount'
        ) {
          sums[index] = values
            .reduce((prev, curr) => {
              const value = Number(curr);
              let sumValue = 0.0;
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0)
            .toFixed(2);
        }
      });
      return sums;
    },
    sumUnCancelAmount({ columns, data }) {
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (
          column.property === 'unCancelAmount' ||
          column.property === 'cancelAmount' ||
          column.property === 'curCancelAmount'
        ) {
          sums[index] = values
            .reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0)
            .toFixed(2);
        }
      });
      return sums;
    },
    changeOrderTailAmount(row, e) {
      this.crud.order.tailAmount = 0.0;
      for (let i = 0; i < this.crud.order.orderList.length; i++) {
        this.crud.order.tailAmount += this.crud.order.orderList[i].tailAmount;
      }
      if (this.resetOrderList) {
        const resetRow = this.resetOrderList.filter(
          (item) => item.sourceCode == row.sourceCode
        )[0];
        const index = this.resetOrderList.indexOf(resetRow);
        this.resetOrderList[index].tailAmount = e;
      }
    },
    changeOrderCurCancelAmount(row, e) {
      this.crud.order.curCancelAmount = 0.0;
      for (let i = 0; i < this.crud.order.orderList.length; i++) {
        this.crud.order.curCancelAmount +=
          this.crud.order.orderList[i].curCancelAmount;
      }
      this.oldCancelAmount = this.crud.order.cancelAmount;
      const amount = this.oldCancelAmount - this.crud.order.curCancelAmount;
      this.crud.order.cancelAmount -= amount;
      if (this.resetOrderList) {
        const resetRow = this.resetOrderList.filter(
          (item) => item.sourceCode == row.sourceCode
        )[0];
        const index = this.resetOrderList.indexOf(resetRow);
        this.resetOrderList[index].curCancelAmount = e;
      }
    },
    updateCustom(e) {
      this.crud.order.customerId = e.id;
      this.crud.order.customerName = e.name;
      this.receiptPaymentQuery.id = e.id;
      this.receiptOrderQuery.customerId = e.id;
      this.queryReceiptAndPayment();
    },
    queryReceiptAndPayment() {
      const data = {
        ...this.receiptPaymentQuery,
      };
      financeSettlement.queryReceiptAndPayment(data).then((res) => {
        if (res.data.content) {
          this.crud.order.taxAmount = 0.0;
          this.crud.order.receiptPaymentList = res.data.content;
          for (let i = 0; i < res.data.content.length; i++) {
            this.crud.order.receiptPaymentList[i].curCancelAmount =
              res.data.content[i].unCancelAmount;
            this.crud.order.taxAmount += res.data.content[i].unCancelAmount;
            this.crud.order.curCancelAmount +=
              res.data.content[i].unCancelAmount;
          }
          this.resetReceiptPaymentList = this.crud.order.receiptPaymentList;
        }
      });
    },
    searchReceiptAndPayment() {
      const { sourceCode, sourceType } = this.receiptPaymentQuery;
      this.crud.order.receiptPaymentList = this.resetReceiptPaymentList;
      if (sourceCode) {
        this.crud.order.receiptPaymentList =
          this.crud.order.receiptPaymentList.filter(
            (item) =>
              (item.sourceCode === null ? '' : item.sourceCode).indexOf(
                sourceCode
              ) >= 0
          );
      }
      if (sourceType) {
        this.crud.order.receiptPaymentList =
          this.crud.order.receiptPaymentList.filter(
            (item) =>
              (item.sourceType === null ? 0 : item.sourceType) == sourceType
          );
      }
    },
    searchReceiptOrder() {
      const { sourceCode, sourceType } = this.receiptOrderQuery;
      this.crud.order.orderList = this.resetOrderList;
      if (sourceCode) {
        this.crud.order.orderList = this.crud.order.orderList.filter(
          (item) =>
            (item.sourceCode === null ? '' : item.sourceCode).indexOf(
              sourceCode
            ) >= 0
        );
      }
      if (sourceType) {
        this.crud.order.orderList = this.crud.order.orderList.filter(
          (item) =>
            (item.sourceType === null ? 0 : item.sourceType) == sourceType
        );
      }
    },
    resetOrderQuery() {
      this.receiptOrderQuery = {
        sourceCode: null,
        sourceType: null,
      };
      this.crud.order.orderList = this.resetOrderList;
    },
    getOrder() {
      const data = {
        ...this.receiptPaymentQuery,
      };
      financeSettlement.getOrder(data).then((res) => {
        if (res.status === 200) {
          this.crud.order.receiptPaymentList = res.order.receiptPaymentList;
        }
      });
    },
    resetReceiptAndPayForm() {
      this.receiptPaymentQuery = {
        id: this.receiptPaymentQuery.id,
        sourceCode: null,
        sourceType: null,
      };
      this.crud.order.receiptPaymentList = this.resetReceiptPaymentList;
    },
    // 保存
    submit() {
      this.$refs['form'].validate((valid) => {
        if (!valid) {
          return;
        }
        this.crud.order.orderList = this.resetOrderList;
        this.crud.order.receiptPaymentList = this.resetReceiptPaymentList;
        // if (this.crud.order.orderList.length === 0) {
        //   Notification.error({title: "请收付款单"})
        //   return;
        // }
        // const order_rules = [
        //   {name: '本次核销金额', value: 'curCancelAmount'}
        // ]
        // let orderList = this.crud.order.orderList
        // if (!this.tableRules(orderList, order_rules, "您还没有抽单")) {
        //   return;
        // }
        this.save();
      });
    },
    tableRules(list, rules, nullMsg) {
      let flag = true;
      if (list === null || list.length === 0) {
        Notification.error({ title: nullMsg });
        return false;
      }
      rules.forEach((rule) => {
        for (let i = 0; i < list.length; i++) {
          if (!list[i][rule.value]) {
            Notification.error({
              title: '序号【' + (i + 1) + '】' + rule.name + '不能为空',
            });
            flag = false;
            break;
          }
        }
      });
      return flag;
    },
    //保存
    save() {
      let that = this;
      that.crud.loadingOpen();
      financeSettlement
        .addOrSave(this.crud.order)
        .then((res) => {
          if (res.success) {
            // this.crud.order = res.data.order
            // this.crud.data = res.data.detailList
            let id = res.data.order.id;
            if (this.$route.params.id == 'add') {
              // this.$store.dispatch("tagsView/delView", this.$route);
              // this.$router.push({params: {id}})
              // this.crud.cleanItemInfo("financeSettlementDetail_add")
              this.$router.replace(
                '/redirect/finance/financeSettlementDetail/' + id
              );
            }
            this.$message({
              message: '保存成功',
              type: 'success',
            });
            // this.vucherOrder = {}
            // this.paymentOrder = {}
            that.crud.loadingClose();
          } else {
            that.crud.loadingClose();
            this.$message({
              message: res.msg,
              type: 'warning',
            });
          }
        })
        .catch((res) => {
          that.crud.loadingClose();
        });
    },
    getReceiptPayment(selection) {
      this.selectReceiptPayment = selection;
    },
    changeCurCancelAmount(row, e) {
      if (row.sourceCode === undefined || row.sourceCode === null) {
        this.$message.error('该单据不正确，缺少单据编号，请确认');
        return;
      }
      const resetRow = this.resetReceiptPaymentList.filter(
        (item) => item.sourceCode == row.sourceCode
      )[0];
      const index = this.resetReceiptPaymentList.indexOf(resetRow);
      this.resetReceiptPaymentList[index].curCancelAmount = e;
      this.sumAmount();
    },
    seachListIndex(list, label, value) {
      if (list) {
        for (let i = 0; i < list.length; i++) {
          if ((list[i][label] = value)) {
            return i;
          }
        }
      }
    },
    addDetail() {
      // if (this.detailName === 'salesOrder_add'){
      //   this.$message({
      //     type:'error',
      //     message: '当前已在添加界面'
      //   })
      // }
      this.$router.push({
        path: '/redirect/finance/financeSettlementDetail/add',
      });
    },
    sumAmount() {
      this.crud.order.curCancelAmount = 0.0;
      for (let i = 0; i < this.crud.order.receiptPaymentList.length; i++) {
        this.crud.order.curCancelAmount +=
          this.crud.order.receiptPaymentList[i].curCancelAmount;
      }
    },
    delReceiptPaymentRow(i) {
      if (this.$route.params.id !== 'add') {
        this.$confirm('此操作将直接删除此条记录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            this.crud.order.receiptPaymentList.splice(i, 1);
            this.$message({
              type: 'success',
              message: '删除成功!',
            });
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除',
            });
          });
      } else {
        this.crud.order.receiptPaymentList.splice(i, 1);
      }
      this.crud.order.taxAmount = 0.0;
      this.crud.order.curCancelAmount = 0.0;
      for (let j = 0; j < this.crud.order.receiptPaymentList.length; j++) {
        this.crud.order.taxAmount +=
          this.crud.order.receiptPaymentList[j].curCancelAmount;
        this.crud.order.curCancelAmount +=
          this.crud.order.receiptPaymentList[j].curCancelAmount;
      }
    },
    delOrderRow(i) {
      if (this.$route.params.id !== 'add') {
        this.$confirm('此操作将直接删除此条记录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            this.crud.order.orderList.splice(i, 1);
            this.$message({
              type: 'success',
              message: '删除成功!',
            });
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除',
            });
          });
      } else {
        this.crud.order.orderList.splice(i, 1);
      }
      this.sumAmount();
      this.changeOrderTailAmount();
    },
    vucherOrderConfirm() {
      this.$refs['vucherOrderForm'].validate((valid) => {
        if (!valid) {
          return;
        }
        this.saveVucherOrder();
      });
    },
    //保存
    saveVucherOrder() {
      let that = this;
      that.crud.loadingOpen();
      const bankList = [
        {
          bankId: this.vucherOrder.bankId,
          bankName: this.vucherOrder.bankName,
          bankOpenBranch: this.vucherOrder.bankOpenBranch,
          bankAccount: this.vucherOrder.bankAccount,
          balanceAmount: this.vucherOrder.balanceAmount,
          taxAmount: this.vucherOrder.taxAmount,
          bankCode: this.vucherOrder.bankCode,
          bankOpenName: this.vucherOrder.bankOpenName,
        },
      ];
      this.vucherOrder.bankList = bankList;
      this.vucherOrder.isSettlement = 'true';
      this.vucherOrder.customerId = this.crud.order.customerId;
      this.vucherOrder.curCancelAmount = this.vucherOrder.taxAmount;
      let params = {
        ...this.vucherOrder,
      };
      crudFinanceCustomerReceipt
        .add(params)
        .then((res) => {
          if (res.success) {
            let item = res.data.financeCustomerReceiptDto;
            item.sourceCode = item.code;
            item.sourceType = 1;
            item.sourceId = item.id;
            item.curCancelAmount = item.taxAmount;
            that.crud.order.receiptPaymentList.push(item);
            this.sumTxtAmount(that.crud.order.receiptPaymentList);
            that.crud.loadingClose();
            this.vucherOrder = {
              busDate: getBusTime(),
            };

            this.showVucherOrder = false;
          } else {
            that.crud.loadingClose();
            this.$message({
              message: res.msg,
              type: 'warning',
            });
          }
        })
        .catch((res) => {
          that.crud.loadingClose();
        });
    },
    paymentOrderConfirm() {
      this.$refs['paymentOrderForm'].validate((valid) => {
        if (!valid) {
          return;
        }
        this.savePaymentOrder();
      });
    },
    //保存
    savePaymentOrder() {
      let that = this;
      that.crud.loadingOpen();
      const bankList = [
        {
          bankId: this.paymentOrder.bankId,
          bankName: this.paymentOrder.bankName,
          bankOpenBranch: this.paymentOrder.bankOpenBranch,
          bankAccount: this.paymentOrder.bankAccount,
          balanceAmount: this.paymentOrder.balanceAmount,
          taxAmount: this.paymentOrder.taxAmount,
          bankCode: this.vucherOrder.bankCode,
          bankOpenName: this.vucherOrder.bankOpenName,
        },
      ];
      this.paymentOrder.bankList = bankList;
      this.paymentOrder.isSettlement = 'true';
      this.paymentOrder.customerId = this.crud.order.customerId;
      let params = {
        ...this.paymentOrder,
      };
      financeSupplierPayment
        .add(params)
        .then((res) => {
          if (res.success) {
            let item = res.data.order;
            item.sourceCode = res.data.order.code;
            item.sourceType = 2;
            item.sourceId = res.data.order.id;
            item.taxAmount = res.data.order.taxAmount * -1;
            item.curCancelAmount = res.data.order.unCancelAmount * -1;
            item.unCancelAmount = res.data.order.unCancelAmount * -1;
            item.curCancelAmount = item.taxAmount;
            that.crud.order.receiptPaymentList.push(item);
            this.sumTxtAmount(that.crud.order.receiptPaymentList);
            that.crud.loadingClose();
            this.showPaymentOrder = false;
            this.paymentOrder = {
              busDate: getBusTime(),
              remark: null,
            };
            this.$forceUpdate();
          } else {
            that.crud.loadingClose();
            this.$message({
              message: res.msg,
              type: 'warning',
            });
          }
        })
        .catch((res) => {
          that.crud.loadingClose();
        });
    },
    sumTxtAmount(receiptPaymentList) {
      this.crud.order.taxAmount = 0.0;
      this.crud.order.curCancelAmount = 0.0;
      for (let i = 0; i < receiptPaymentList.length; i++) {
        this.crud.order.taxAmount += receiptPaymentList[i].unCancelAmount;
        this.crud.order.curCancelAmount +=
          receiptPaymentList[i].curCancelAmount;
      }
    },
    sumRow({ columns, data }) {
      const sums = [];
      for (let i in columns) {
        if (
          ['taxAmount', 'cancelAmount', 'unCancelAmount'].includes(
            columns[i].property
          )
        ) {
          let selectSum = 0;
          this.$refs.table1.selection.forEach((item) => {
            selectSum += item[columns[i].property];
          });
          sums[i] = (
            <p>
              {selectSum}
              <hr />
              {this.summary[columns[i].property] || ''}
            </p>
          );
        }
        sums[0] = (
          <p>
            选中
            <hr />
            合计
          </p>
        );
      }
      return sums;
    },
    jumpOrder(row){
      if (row.sourceType === '4'){
        this.$router.push({path:`/sale/salesorderDetail/${row.sourceId}`})
      }
    },
    addReceiptOrder() {
      if (isEmpty(this.crud.order.customerId)) {
        this.$message.warning('请选择往来单位');
        return;
      }
      this.showVucherOrder = true;
    },
    addPaymentOrder() {
      if (isEmpty(this.crud.order.customerId)) {
        this.$message.warning('请选择往来单位');
        return;
      }
      this.showPaymentOrder = true;
    },
    changeVucherBank(e) {
      const {
        id,
        name,
        bankOpenBranch,
        bankAccount,
        balanceAmount,
        taxAmount,
        remark,
        code,
        bankOpenName,
      } = e;
      this.vucherOrder.bankId = id;
      this.vucherOrder.bankName = name;
      this.vucherOrder.bankCode = code;
      this.vucherOrder.bankOpenName = bankOpenName;
      this.vucherOrder.bankOpenBranch = bankOpenBranch;
      this.vucherOrder.bankAccount = bankAccount;
      this.vucherOrder.balanceAmount = balanceAmount;
      // this.vucherOrder.remark = remark
      this.$set(this.vucherOrder, 'remark', remark);
    },
    changePaymentBank(e) {
      const {
        id,
        name,
        bankOpenBranch,
        bankAccount,
        balanceAmount,
        taxAmount,
        remark,
        bankOpenName,
        code,
      } = e;
      this.paymentOrder.bankId = id;
      this.paymentOrder.bankName = name;
      this.paymentOrder.bankCode = code;
      this.paymentOrder.bankOpenName = bankOpenName;
      this.paymentOrder.bankOpenBranch = bankOpenBranch;
      this.paymentOrder.bankAccount = bankAccount;
      this.paymentOrder.balanceAmount = balanceAmount;
      this.paymentOrder.remark = remark;
    },
  },
};
</script>

<style lang="scss" scoped>
.remarkBox {
  position: relative;

  .hiRemark {
    position: fixed;
    width: 300px;
    height: 400px;
    top: 40%;
    background-color: #ffffff;
    border: #f2f2f2 1px solid;
    z-index: 9999;
    overflow: auto;
    display: none;
    border-radius: 10px;
    background-size: cover;
    white-space: pre-line;

    .remarkTitle {
      background-color: #b0c7f9;
      width: 100%;
      height: 40px;
      padding-left: 10px;
      font-size: 18px;
    }
  }

  &:hover .hiRemark {
    display: block;
  }
}
.sourceCode{
  color:blue;
  cursor: pointer;
}
</style>
